<script lang="ts" setup>
import { shopApigetRecommendProduct } from "@/api/shopApi/index";
import { reactive, onMounted } from "vue";
import ShopCard from "../components/shopCard.vue";

const d = reactive({
  recommendData: [],
});
const props = defineProps(["uuid"]);

const init = async () => {
  const { data } = await shopApigetRecommendProduct({ uuid: props?.uuid,per_page:20 });
  if (data.error_code === 0) {
    d.recommendData = data.data.data;
  }
};

onMounted(() => init());
</script>

<template>
  <view v-if="!!d.recommendData?.length" class="items">
    <ShopCard
      v-for="(item, index) in d.recommendData"
      :key="index"
      :item="item"
    />
  </view>
</template>

<style lang="scss" scoped>
.items {
  padding: 0 4%;
}
</style>
